let userlistModule = (function(){
    let $tbody = $('.tableBox').find('tbody'),
        $deleteAll = $('.deleteAll'),
        $selectBox = $('.selectBox'),
        $searchInp = $('.searchInp'),
        $checkAll = $('thead').find('input[type=checkbox]'),
        $checkList = null;// 获取所有checkbox的选中状态（一开始页面是没有数据的）

    // 动态渲染页面
    async function bindHTML(){
        getDepartment();
        getUserList();
    }
    // 获取部门信息
    async function getDepartment(){
        let result = await axios.get('/department/list');
        if(result.code == 0){
            let str = '';
            str += '<option value="0">全部</option>'
            result.data.forEach(item=>{
                str += `<option value="${item.id}">${item.name}</option>`
            })
            $selectBox.html(str)
        }
        alert('小主，网络繁忙，请稍后重试');
        return;
    }
    // 获取用户通讯录
    async function getUserList(){
        let result = await axios.get('/user/list',{
            params:{
                'departmentId':$selectBox.val(),
                'search':$searchInp.val().trim()
            }
        })
        if(result.code == 0){
            let str = '';
            result.data.forEach(item=>{
                let {
                    id,
                    name,
                    sex,
                    email,
                    phone,
                    departmentId,
                    department,
                    jobId,
                    job,
                    desc
                } = item;
                str += ` <tr>
                <td class="w3"><input type="checkbox" userId=${id}></td>
                <td class="w10">${name}</td>
                <td class="w5">${sex==0?'男':'女'}</td>
                <td class="w10">${department}</td>
                <td class="w10">${job}</td>
                <td class="w15">${email}</td>
                <td class="w15">${phone}</td>
                <td class="w20">${desc}</td>
                <td class="w12" userId=${id}>
                    <a href="javascript:;">编辑</a>
                    <a href="javascript:;">删除</a>
                    <a href="javascript:;">重置密码</a>
                </td>
            </tr>`
            })
            $tbody.html(str);
            $checkList = $tbody.find('input[type=checkbox]');
        }else{
            // 没有匹配的信息
            $tbody.html('')
            $checkList = $tbody.find('input[type=checkbox]');
        }
    }
    // 表单 批量删除(全选、取消全选)
    function selectAll(){
        $checkAll.click(()=>{//!!!强
            let checked = $checkAll.prop('checked');
            $checkList.prop('checked',checked);
        })
        $tbody.click((e)=>{
            let target = e.target;
            if(target.tagName === 'INPUT'){
                let flag = true;
                [].forEach.call($checkList,item=>{
                    if($(item).prop('checked') === false){
                        flag = false;
                    }
                })
                $checkAll.prop('checked',flag)
            }
            
        })
        // 批量删除
        $deleteAll.click(e=>{
            // 接口和单独删除用户的是一样的，所以这里把需要删除的用户id放在一个数组里，通过递归调用，实现删除
            let arr = [];
            [].forEach.call($checkList,item=>{
                if($(item).prop('checked')){
                    arr.push($(item).attr('userId'));
                }
            })
            if(!arr.length){
                alert('小主，您还未选中任何数据~');
                return;
            }
            // 删除前的确认
            let flag = confirm(`小主，您确定删除这${arr.length}条数据吗`)
            if(!flag) return;
            // 删除的临界条件的判断
            let complete = ()=>{
                if(index >= arr.length - 1){
                    alert(`小主，已成功为您删除选中的数据`)
                }else{
                    // 删除过程中遇到维妮塔
                    alert(`小主，已成功为您删除${index+1}条数据,删除中遇到部分信息无法删除，奴家已经为您结束删除操作`)
                }
                getUserList();
            }
            let index = -1;
            let send = async()=>{
                if(index >= arr.length-1){
                    complete();
                    return;
                }
                let result = await axios.get('/user/delete',{
                    params:{
                        userId:arr[++index]
                    }
                });
                if(result.code != 0){
                    complete();
                    return;
                }
                send();
            }
            send();
        })
        
    }
    // 模糊搜索
    function searchHandle(){
        $selectBox.change(getUserList);
        $searchInp.on('keydown',e=>{
            if(e.keyCode === 13){
                // 重新渲染用户列表
                getUserList();
            }
        })
    }
    // 编辑、删除  重置密码 功能
    function handle(){
        // 事件委托
        $tbody.click(async function(e){
            let target = e.target,
                $target = $(target),
                tagName = target.tagName,
                TEXT = $target.html();
            let userId = $target.parent().attr('userId')
            if(tagName === 'A'){
                if(TEXT === '编辑'){
                    // 跳到 新增客户 页面
                    window.location.href = `useradd.html?id=${userId}`;
                }else if(TEXT === '删除'){
                    // 删除前的确认
                    let flag = confirm(`小主，您确定要删除编号为${userId}员工的信息吗？`);
                    if(!flag) return;
                    let result = await axios.get('/user/delete',{
                        params:{
                            userId:userId
                        }
                    })
                    if(result.code == 0){
                        alert(`小主，已成功为您删除编号为${userId}的员工的信息~`)
                        // 从本页面移除该数据
                        $target.parent().parent().remove();
                        $checkList = $tbody.find('input[type=checkbox]');
                        return;
                    }else{
                        alert('小主，删除过程中遇到了问题')
                    }
                }else if(TEXT === '重置密码'){
                    // 重置前的确认
                    let flag = prompt(`小主，请输入您为编号为${userId}员工重置的新密码`);
                    if(!flag) return;
                    // console.log(flag)
                    let result = await axios.post('/user/resetpassword',{
                        params:{
                            userId:userId,
                            password:flag
                        }
                    })
                    // console.log(result)
                    if(result.code == 0){
                        alert(`小主，已成功为您重置编号为${userId}的员工的密码~`)
                    }else{
                        alert('小主...')
                    }
                }
            }
            
        })
    }
    return {
        init(){
            bindHTML();
            selectAll();
            searchHandle();
            handle();
            
        }
    }
}())
userlistModule.init();